import {observer} from 'mobx-react-lite';
import {Path, SvgProps} from 'react-native-svg';
import {useGlobalStore} from '../../mobx';
import {getColorStr} from '../../themes';
import {SvgCommon} from './Common';

export const SvgDir = observer((props: SvgProps) => {
  const {theme} = useGlobalStore();
  return (
    <SvgCommon {...props}>
      <Path
        d="M18.5 3H5.5C4.39543 3 3.5 3.89543 3.5 5V20C3.5 21.1046 4.39543 22 5.5 22H18.5C19.6046 22 20.5 21.1046 20.5 20V5C20.5 3.89543 19.6046 3 18.5 3Z"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M7.01697 7.5H8.98157"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M11.2966 7.5H16.983"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M7.01697 12.5H8.98157"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M11.2966 12.5H16.983"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M7.01697 17.5H8.98157"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
      <Path
        d="M11.2966 17.5H16.983"
        stroke={getColorStr(theme, 'color_31')}
        strokeWidth="1.5"
        strokeLinecap="round"
      />
    </SvgCommon>
  );
});
